<!--
<alert ref="alert"></alert>

this.$refs.alert.success({
  title: '系统提示',
  description: '保存成功!'
});
-->
<template>
  <div class="alert" v-show="isShow">
    <el-alert
      :title="title"
      :type="type"
      :description="description"
      close-text="知道了"
      show-icon>
    </el-alert>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        isShow: false,
        title: '系统提示',
        type: 'info',
        description: ''
      };
    },
    methods: {
      success (options) {
        this.show(options, 'success');
      },
      error (options) {
        this.show(options, 'error');
      },
      warning (options) {
        this.show(options, 'warning');
      },
      info (options) {
        this.show(options, 'info');
      },
      show (options, type) {
        if (!type) {
          type = 'info';
        }
        this.type = type;
        if (options.title) {
          this.title = options.title;
        }
        if (options.description) {
          this.description = options.description;
        }
        this.isShow = true;
      }
    }
  };
</script>

<style scoped>
  .alert {
    padding: 10px;
  }
</style>
